import { Button, message, Select } from 'antd';
import React, { useState, useRef, useEffect } from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import ProTable from '@ant-design/pro-table';
import { queryRule, BrandRule } from './service';
import { money_trans } from '@/utils/utils';

const { Option } = Select;
const TableList = () => {
  const actionRef = useRef();
  const [currentRow, setCurrentRow] = useState();
  const [Brand, setBrand] = useState([]);
  const [count, setCount] = useState();
  const handleBrand = () => {
    BrandRule()
      .then((res) => {
        const { code } = res;
        return code === 0 ? setBrand(res.data) : message.error(res.message);
      })
      .catch((err) => {
        console.log(err);
      });
  };
  useEffect(() => {
    handleBrand();
  }, []);
  const columns = [
    {
      title: '商品名称',
      dataIndex: 'name',
      formItemProps: {
        rules: [
          {
            required: true,
            message: '商品名称为必填项',
          },
        ],
      },
      render: (dom, entity) => {
        return <a>{dom}</a>;
      },
    },
    {
      title: '是否赠送积分',
      dataIndex: 'isIntegral',
      hideInSearch: true,
      valueEnum: {
        false: {
          text: '否',
          status: 'Default',
        },
        true: {
          text: '是',
          status: 'Success',
        },
      },
    },

    {
      title: '标价',
      hideInSearch: true,
      dataIndex: 'price',
      render:(_,record)=>{
        return money_trans(record.price)
      }
    },
    {
      title: '进货价格',
      hideInSearch: true,
      dataIndex: 'purchasePrice',
      render:(_,record)=>{
        return money_trans(record.purchasePrice)
      }
    },
    {
      title: '上下架状态',
      dataIndex: 'status',
      valueEnum: {
        0: {
          text: '下架',
          status: 'Default',
        },
        1: {
          text: '上架',
          status: 'Success',
        },
      },
      renderFormItem: (item, { defaultRender, ...rest }, form) => {
        return (
          <Select placeholder="请选择是否上架" allowClear>
            <Option value={1}>上架</Option>
            <Option value={0}>下架</Option>
          </Select>
        );
      },
    },
    {
      title: '生产日期',
      hideInSearch: true,
      dataIndex: 'generatedDate',
      render:(dom)=>{return <div>{new Date(dom).toLocaleString()}</div>}

    },
    {
      title: '保质期',
      hideInSearch: true,
      dataIndex: 'expireDate',
      render:(dom)=>{return <div>{new Date(dom).toLocaleString()}</div>}
    },

  ];
  return (
    <PageContainer>
      <ProTable
        bordered
        headerTitle="临期商品列表"
        actionRef={actionRef}
        rowKey="id"
        scroll={{ x: 1200 }}
        search={{
          labelWidth: 120,
        }}
        toolBarRender={false}
        request={(params, sorter, filter) => {
          delete params.current;
          delete params.pageSize;
          return queryRule({ ...params });
        }}
        columns={columns}
        postData={(payload) => {

          const { data, total } = payload;
          return payload||[];
        }}
        pagination={{
          defaultPageSize: 30,
          showSizeChanger: false,
          showTitle: false,
        }}
      />
    </PageContainer>
  );
};

export default TableList;
